<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@include file="/jsp/base/pageBase.jsp" %>
<%@ page isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="cola" uri="cola" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">

    <title>${programName}</title>

    <meta name="keywords" content="${programName}-内部网站管理系统">
    <meta name="description" content="">

    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>
    <![endif]-->

    <link rel="shortcut icon" href="${webRoot}/favicon.ico">
    <link href="${webRoot}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${webRoot}/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="${webRoot}/css/animate.css" rel="stylesheet">
    <link href="${webRoot}/css/style.css?v=4.1.0" rel="stylesheet">
    <style>
        /*--------------xlp----------------*/
        .smallPanel {
            background: #fff;
        }

        .labekBg0 {
            background: url("${webRoot}/img/u1314.png") no-repeat;
            padding-top: 10px;
            height: 30px;
            width: 40px;
            display: block;
            font-size: 14px;
            padding-left: 5px;
        }
        .labekBg1 {
            background: url("${webRoot}/img/u1311.png") no-repeat;
            padding-top: 10px;
            height: 30px;
            width: 40px;
            display: block;
            font-size: 14px;
            padding-left: 5px;
        }
        .labekBg2 {
            background: url("${webRoot}/img/u1309.png") no-repeat;
            padding-top: 10px;
            height: 30px;
            width: 40px;
            display: block;
            font-size: 14px;
            padding-left: 5px;
        }

        .innerLI {
            position: relative;
            border-top: 2px dashed #e7eaec;
            padding-top: 10px;
            background: #fff;
            padding: 15px 20px;
        }

        .bellpostion {
            position: fixed;
            top: 15px;
            right: 55px;
        }

        .bellStyle {
            width: 60px;
            height: 30px;
            text-align: center;
            line-height: 24px;
            color: #999c9e;
            margin-bottom: 10px;
            cursor: pointer;
            position: fixed;
            top: 8px;
            right: 22px;
            z-index: 666;
            border-radius: 30px;
        }

        .bellStyle i {
            margin-top: 7px;
        }

        #noticeDiv {
            height: 100vh;
            background: white;
            width: 500px;
            position: fixed;
            top: 43px;
            right: -23px;
            z-index: 6666;
            border-left: 1px solid #e7eaec;
            border-top: 1px solid #e7eaec;
            box-sizing: border-box;
            padding-left: 0px;
        }

        .noticeContent {
            height: 82vh;
            overflow-y: scroll;
        }

        .smallNotice {
            width: 480px;
            overflow: hidden;
            height: auto;
            margin: auto;
            background: white;
            border-bottom: 1px solid #e7eaec;
            padding: 8px;
            box-sizing: border-box;
            position: relative;
            border-bottom: 1px solid #e7eaec;
            list-style: none;
            padding: 15px 0px;
            position: relative;
            padding: 15px 15px
        }

        /*   .noticeContent .smallNotice:last-child{
               border-bottom:1px solid transparent;
           }*/
        .closeBtn {
            position: absolute;
            top: 4px;
            right: 24px;
            cursor: pointer;
            font-size: 15px;
        }

        .arrowBtn {
            position: absolute;
            top: 4px;
            right: 20px;
            cursor: pointer;
            font-size: 15px;
            height: 20px;
            width: 20px;
            color: white;
            border-radius: 50%;
            padding-top: 2px;
            text-align: center;
            margin-top: 25px;

        }

        .colorBg0 {
            background: #003399;/* 蓝色 */
        }
        .colorBg1 {
            background: #00b300;/* 绿色 */
        }
        .colorBg2 {
            background: #ff0000;
        }
        .noticeLeft {
            width: 40px;
            float: left;

        }

        .noticeLeft i {
            font-size: 23px;
            margin-top: 7px;
            margin-left: 6px;
        }

        .noticeRight {
            width: 240px;
            float: left;

        }

        .noticeTitle {
            font-size: 14px;
            color: #535a5b;

        }

        .noticeDetail {
            font-size: 12px;
            color: #949494;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .upBtn {
            height: 5vh;
            font-size: 36px;
            text-align: center;
            cursor: pointer;
        }

        .moreBtn {
            height: 5vh;
            height: 5vh;
            width: 436px;
            margin: auto;
            margin-left: 20px;
        }

        .hide {
            display: none;
        }

        @keyframes move {
            from {
                width: 0px;
            }
            to {
                width: 500px;
            }
        }

        @-webkit-keyframes move /*Safari and Chrome*/
        {
            from {
                width: 0px;
            }
            to {
                width: 500px;
            }
        }

        .anIxlp {
            animation: move 0.1s 1 forwards;
            -webkit-animation: move 0.1s 1 forwards; /*Safari and Chrome*/
        }
        /*--------------xlp----------------*/
        /* 有效区域的展示 */
        /*  着重消息提醒
         */
        .message-notification{
            max-height: calc(100% - 15px);
            position: fixed;
            width: 270px;
            min-height: 100px;
            padding:15px 0 30px 15px;
            background: #0ff;
            right:40px;
            top:10px;
            z-index: 9999;
            border-radius: 5px;
            box-shadow: 0 0 5px 1px #ccc;
        }
        .message-title{
            line-height: 30px;
            padding-right: 15px;
        }
        .message-title span{
            font-size: 18px;
            font-weight: 600;
        }
        .fa-exclamation-circle{
            color: #00ACEB;
            font-size: 20px;
        }
        .fa-times-circle-o{
            color: #90BEC4;
            font-size: 20px;
            float: right;
            margin-top: 5px;
            cursor: pointer;
        }
        #message-ul{
            padding-left: 22px;
            list-style: none;
            max-height: 230px;
            overflow-y: auto;
        }
        #message-ul li label{
            font-weight: normal;
        }
        .message-time{
            position: absolute;
            bottom:5px;
            left:50%;
            width:100px;
            text-align: center;
            margin-left:-50px;
        }


        .graph{
            width: 264px;
            height: 2px;
            background-color: #f5f5f5;
            border-radius: 4px;
            box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
            position: absolute;
            bottom: 3px;
            left: 2px;
        }
        #bar{
            display: block;
            background: #4FA4A5;
            float: left;
            height: 100%;
        }
    </style>
</head>

<body class="fixed-sidebar full-height-layout gray-bg" style="overflow:hidden">
<div id="wrapper1" style="position:absolute;z-index:2002;left:0;top:0;background-color:#e3e3e3;display:none">
</div>
<div id="wrapper">
    <!--左侧导航开始-->
    <nav class="navbar-default navbar-static-side" role="navigation">
        <div class="nav-close"><i class="fa fa-times-circle"></i>
        </div>
        <div class="sidebar-collapse">
            <ul class="nav" id="side-menu">
                <li class="nav-header">
                    <div class="dropdown profile-element text-center">
                        <span><img alt="image" id="logoImg" class="img-circle"
                                   style="max-width: 34px;margin-bottom:6px;"
                                <c:choose>
                                    <c:when test="${record.userIcon.length() > 0}">
                                        src="${imgServer}${record.userIcon}"
                                    </c:when>
                                    <c:otherwise>
                                        src="${webRoot}/img/defultHome.jpeg"
                                    </c:otherwise>
                                </c:choose>
                        />
                        </span>
                        <a data-toggle="dropdown" class="dropdown-toggle pt10" href="#">
                            <span class="clear">
                            <span class="text-xs block"
                                  style="font-size:13px;">admin${sessionScope.LOGIN_USER_INFO.realName}</span>
                            </span>
                        </a>
                    </div>
                    <div class="logo-element">
                        <span><img alt="image" class="img-circle" style="width:30px;"
                        <c:choose>
                        <c:when test="${record.userIcon.length() > 0}">
                                   src="${imgServer}${record.userIcon}"
                        </c:when>
                        <c:otherwise>
                                   src="${webRoot}/img/logo-element.png"
                        </c:otherwise>
                        </c:choose>
                        ></span>
                    </div>
                </li>

                <!-- 菜单 -->
                <cola:main-menu urlPrefix="${webRoot}"></cola:main-menu>
            </ul>
        </div>
    </nav>
    <!--左侧导航结束-->
    <!--右侧部分开始-->
    <div id="page-wrapper" class="gray-bg dashbard-1">
        <div class="row border-bottom">
            <nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
                <div class="navbar-header pl5">
                    <div class=" col-sm-1 text-left p0 m0">
                        <a class="navbar-minimalize minimalize-styl-2 btn btn-primary m0 mt15" href="#"><i
                                class="fa fa-angle-left"></i> </a>
                    </div>
                    <div class=" col-sm-11 text-left pt10"
                         style="line-height:30px;color:#2f4050;font-size:28px;left:-15px;">
                        ${programName}
                    </div>
                </div>

                <div class="change">
                    <button class="btns" style="margin-top:0">更换主题</button>
                    <div class="qiehuan">
                        <div class="liebiao bgs1">
                            <div class="yanse1"></div>
                            <span>高级灰</span></div>
                        <div class="liebiao bgs2">
                            <div class="yanse2"></div>
                            <span>清新绿</span></div>
                        <div class="liebiao bgs3">
                            <div class="yanse3"></div>
                            <span>蔷薇粉</span></div>
                        <div class="liebiao bgs4">
                            <div class="yanse4"></div>
                            <span>孔雀绿</span></div>
                        <div class="liebiao bgs5">
                            <div class="yanse5"></div>
                            <span>商务紫</span></div>
                        <div class="liebiao bgs6">
                            <div class="yanse6"></div>
                            <span>雾霾蓝</span></div>
                        <div class="liebiao bgs7">
                            <div class="yanse7"></div>
                            <span>太空蓝</span></div>
                        <div class="liebiao bgs8">
                            <div class="yanse8"></div>
                            <span>西瓜红</span></div>
                        <div class="liebiao bgs9">
                            <div class="yanse9"></div>
                            <span>旧主题</span></div>
                    </div>

                </div>
            </nav>
        </div>
        <div id="wrapper2" style="position:absolute;z-index:2002;right:0;top:0;background-color:#e3e3e3;display:none">
        </div>
        <div class="row content-tabs">
            <button class="roll-nav roll-left J_tabLeft"><i class="fa fa-backward"></i>
            </button>
            <nav class="page-tabs J_menuTabs">
                <div class="page-tabs-content">
                    <a style="display: none" href="javascript:;" class="active J_menuTab" id="homeIndex" data-id="${webRoot}/system/desktop/initHome">首页</a>
                </div>
            </nav>
            <button class="roll-nav roll-right J_tabRight"><i class="fa fa-forward"></i>
            </button>
            <%--<button class="roll-nav roll-right J_refreshRight" onclick="refreshTab($('.active.J_menuTab'));"><i class="fa fa-refresh"></i>--%>
            <%--刷新--%>
            <%--</button>--%>
            <div class="btn-group roll-nav roll-right">
                <button class="dropdown J_tabClose" data-toggle="dropdown">关闭操作<span class="caret"></span>

                </button>
                <ul role="menu" class="dropdown-menu dropdown-menu-right">
                    <li class="J_tabShowActive"><a>定位当前选项卡</a>
                    </li>
                    <li class="divider"></li>
                    <li class="J_tabCloseAll"><a>关闭全部选项卡</a>
                    </li>
                    <li class="J_tabCloseOther"><a>关闭其他选项卡</a>
                    </li>
                </ul>
            </div>
            <a href="${webRoot}/www/login/logout" class="roll-nav roll-right J_tabExit"><i
                    class="fa fa fa-sign-out"></i>
                退出</a>
        </div>
        <div class="row J_mainContent" id="content-main">
            <iframe class="J_iframe" id="J_iframe" name="iframe0" width="100%" height="100%"
                    src="${webRoot}/system/desktop/initHome" frameborder="0"
                    data-id="${webRoot}/system/desktop/initHome"
                    seamless style="display: block;"></iframe>
            <iframe class="J_iframe" id="yimiphone" name="iframe0" width="100%" height="100%"
                    src="${webRoot}/system/yimiphone/init" frameborder="0"
                    data-id="${webRoot}/system/yimiphone/init"
                    seamless style="display: none;"></iframe>
        </div>
        <div class="message-notification" style="display: none;">
            <div class="message-title">
                <i class="fa fa-exclamation-circle" aria-hidden="true"></i>
                <span>请注意以下未读提醒</span>
                <i class="fa fa-times-circle-o" aria-hidden="true"></i>
            </div>
            <ul id="message-ul">

            </ul>
            <div class="message-time">
                <span></span>s后自动关闭
            </div>
            <div class="graph">
                <strong id="bar" style="width:7%;"></strong>
            </div>
        </div>
    </div>
    <!--右侧部分结束-->

    <!--右侧边栏开始-->
    <div id="right-sidebar">
        <div class="sidebar-container">
            <div class="ibox-content">
            </div>
        </div>
    </div>
    <!--右侧边栏结束-->
</div>

<!-- 全局js -->
<script src="${webRoot}/js/jquery.min.js?v=2.1.4"></script>
<script src="${webRoot}/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${webRoot}/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="${webRoot}/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="${webRoot}/js/plugins/layer/layer.min.js"></script>
<script type='text/javascript' src="${webRoot}/js/plugins/fullcalendar/moment.min.js"></script>

<script type="text/javascript" src="${webRoot}/js/sapoOCX.js"></script>
<script type="text/javascript" src="${webRoot}/js/webSocket.js"></script>
<script type="text/javascript" src="${webRoot}/js/index.js"></script>


<!-- 自定义js -->
<script src="${webRoot}/js/hplus.js?v=4.1.0"></script>
<script type="text/javascript" src="${webRoot}/js/contabs.js"></script>
<script type="text/javascript" src="${webRoot}/jsp/system/desktop/desktop.js?v=0.01"></script>
<script type="text/javascript">
    $(".btns").click(function () {
        $(".qiehuan").show();
    });
    $(".change").mouseleave(function () {
        $(".qiehuan").hide();
    });
    //8种主题
    var colors = ["gray", "green", "pink", "greenKQ", "purple", "blueWM", "blueTK", "redXG"];
    $(function () {
        //
        for (var i = 0; i < 8; i++) {
            var j = parseInt(i) + 1;
            j = j.toString();
            (function (i) {
                $(".bgs" + j).on("click", function () {
                    $("#wrapper").attr("class", colors[i]);
                    setCookie("theme", colors[i]);
                });
            })(i);
        }
        ;
    });

    $("#YMIndex").on("click", function () {

        $("#yimiphone").attr("src",$("#YMIndex").attr("data-id"));
        $("#yimiphone").attr("data-id",$("#YMIndex").attr("data-id"));
    });

    //重置
    $(".bgs9").on("click", function () {
        $("#wrapper").attr("class", "");
        deleteCookie("theme");
    });

    function setCookie(_name, _val) {
        var _day = 360;//保存一年
        var _date = new Date();
        var _time = Date.parse(_date);
        var _lastTime = 30 * 24 * 60 * 60 * 1000;
        _date.setTime(_time + _lastTime);
        document.cookie = _name + "=" + escape(_val) + ";expires =" + _date.toGMTString();

    };

    function getCookie(_name) {
        if (document.cookie.length > -1) {
            if (document.cookie.indexOf(_name + "=") > -1) {
                var _indexStart = document.cookie.indexOf(_name + "=");
                _indexStart = _indexStart + _name.length + 1;
                _indexEnd = document.cookie.indexOf(";", _indexStart);
                if (-1 == _indexEnd) _indexEnd = document.cookie.length;
                return unescape(document.cookie.substring(_indexStart, _indexEnd));
            }
        }
    };
    function deleteCookie(_name) {
        var _date = new Date();
        _date.setTime(_date.getTime() - 1);
        if (getCookie(_name)) {
            document.cookie = _name + "=" + escape(getCookie(_name)) + ";expires = " + _date.toGMTString();
        }
    };
    function checkCookie() {
        if (getCookie("theme")) {
            $("#wrapper").attr("class", getCookie("theme"));
        }
    };
    checkCookie();//首次加载缓存中的主题
</script>

<!-- 第三方插件 -->
<%--<script src="${webRoot}/js/plugins/pace/pace.min.js"></script>--%>

</body>

</html>